<!-- Copyright (c) 2019-2020 十三 all rights reserved. -->
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:replace="header::head-fragment('NewBee商城-商品详情','detail')">
</head>
<body>
<header th:replace="header::header-fragment"></header>
<link href="/css/chengui">
<div id="detail">
    <!-- nav -->
    <nav th:replace="header::nav-fragment"></nav>

    <div class="dc">
        <div class="content w">
            <div class="title fl">商品详情</div>
            <div class="clear"></div>
        </div>
    </div>

    <div class="intro mt20 w clearfix">
        <div class="left fl" style="position: relative;">
            <div class="swiper-container fl">
                <img th:src="@{${book.getBookImg()}}">
            </div>
        </div>
        <div class="right fr">
            <div class="h3 ml20 mt20" th:text="${book.getBookName()}">NewBeeMall</div>
            <div class="sub_title mr40 ml20 mt10" th:text="'作者'+${book.getBookAuthor()}">NewBeeMall</div>
            <div class="sub_title mr40 ml20 mt10">
                <h5 th:text="'出版时间：'+${Bookdate}" class="value"></h5>
                <h5 th:text="'出版社：'+${book.getPublisher()}" class="value"></h5>
                <h5 th:text="'类型：'+${category}" class="value"></h5>
            </div>
            <div class="item_price mr40 ml20 mt10">
                <th:block th:text="${book.getPrice()}+'元'"></th:block>
                <input id="bookId" th:value="${book.id}" type="hidden">
            </div>

            <div class="order">
                <input class="car" type="button"  value="加入购物车" id="AddCartbtn" style="margin-top: 134px"/>
            </div>
            <div class="tb-extra ml20" id="J_tbExtra">
                <dl>
                    <dt>承诺</dt>
                    <dd><a class="J_Cont" title="满足7天无理由退换货申请的前提下，包邮商品需要买家承担退货邮费，非包邮商品需要买家承担发货和退货邮费。" href="#"
                           target="_blank"><img th:src="@{/image/7d.jpg}">7天无理由</a></dd>
                </dl>

            </div>
        </div>
        <div class="clear"></div>
    </div>
    <!-- 这里使用的是 th:utext 标签，用 th:text 不会解析 html，用 th:utext 会解析 html -->
    <div id="bookinfo" class="goods mt20 w clearfix">
    <h3>商品信息</h3>
    <p th:text="${book.getInfo()}" ></p>
    </div>
</div>

<!-- jQuery -->
<script th:src="@{/templates/manager/plugins/jquery/jquery.min.js}"></script>
<script th:src="@{/templates/manager/plugins/sweetalert/sweetalert.min.js}"></script>
<script th:src="@{/mall/js/search.js}" type="text/javascript"></script>
<script src="https://libs.baidu.com/jquery/2.0.0/jquery.js"></script>
<script th:inline="javascript">
    var user = [[${session.user_id}]];
</script>
<script type="text/javascript">
    $(document).ready(function() {
        $("#AddCartbtn").click(function() {
            var bookNum = 1;
            var bookid = $("#bookId").val();
            if (user == null || user == '') {
                alert("请先登录")
                location.href = "/toLogin";
            }
            $.ajax({
                url: "cart/add",
                dataType: "json",
                type: "post",
                data: {'bid': bookid, 'count': bookNum},
                success: function (data) {
                    if (data == "300") {
                        alert("添加成功");
                        location.href="/index";
                    } else {
                       alert("添加失败")
                    }
                }
            })
        })
    })
</script>
</body>
</html>
